
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="shortcut icon" type="image/x-icon" href="style/favicon.ico"/>
<link href="style/style.css" rel="stylesheet" type="text/css" />
<link href="style/bootstrap.min.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/gatling.js"></script>
<script type="text/javascript" src="js/moment.min.js"></script>
<script type="text/javascript" src="js/menu.js"></script>
<script type="text/javascript" src="js/all_sessions.js"></script>
<script type="text/javascript" src="js/stats.js"></script>
<script type="text/javascript" src="js/highstock.js"></script>
<script type="text/javascript" src="js/highcharts-more.js"></script>
<script type="text/javascript" src="js/theme.js"></script>
<script type="text/javascript" src="js/unpack.js"></script>
<title>Gatling Stats - GetPerson-API</title>
</head>
<body>
<div class="frise"></div>
<div class="container details">
    <div class="head">
        <a href="http://gatling.io" target="blank_" title="Gatling Home Page"><img alt="Gatling" src="style/logo.png"/></a>
    </div>
    <div class="main">
        <div class="cadre">
                <div class="onglet">
                    <img src="style/cible.png" />
                    <p><span>apigatlingsimulationtest</span></p>
                </div>
                <div class="content">
                    <div class="sous-menu">
                        <div class="item "><a href="index.html">GLOBAL</a></div>
                        <div class="item ouvert"><a id="details_link" href="#">DETAILS</a></div>
                        <script type="text/javascript">
                          var timestamp = 1517574849832;
                          var runStartHumanDate = moment(timestamp).format("YYYY-MM-DD HH:mm:ss Z");
                          document.writeln("<p class='sim_desc' title='"+ runStartHumanDate +", duration : 20 seconds' data-content='null'>");
                          document.writeln("<b>" + runStartHumanDate + ", duration : 20 seconds null</b>");
                          document.writeln("</p>");
                        </script>
                    </div>
                    <div class="content-in">
                        <h1><span>> </span>GetPerson-API</h1>
                        <div class="article">
                            
                        <div class="infos">
                            <div class="infos-in">
	                        <div class="infos-title">STATISTICS</div>
                                <div class="repli"></div>                               
                                <div class="info">
                                    <h2 class="first">Executions</h2>
                                    <table>
                                        <thead>
                                            <tr><th></th><th>Total</th><th>OK</th><th>KO</th></tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <td class="title"></td>
                                                <td id="numberOfRequests" class="total"></td>
                                                <td id="numberOfRequestsOK" class="ok"></td>
                                                <td id="numberOfRequestsKO" class="ko"></td>
                                            </tr>
                                            <tr>
                                                <td class="title">Mean req/s</td>
                                                <td id="meanNumberOfRequestsPerSecond" class="total"></td>
                                                <td id="meanNumberOfRequestsPerSecondOK" class="ok"></td>
                                                <td id="meanNumberOfRequestsPerSecondKO" class="ko"></td>
                                            </tr>
                                        </tbody>
                                    </table>
                                    <h2 class="second">Response Time (ms)</h2>
                                    <table>
                                        <thead>
                                            <tr>
                                                <th></th>
                                                <th>Total</th>
                                                <th>OK</th>
                                                <th>KO</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <td class="title">Min</td>
                                                <td id="minResponseTime" class="total"></td>
                                                <td id="minResponseTimeOK" class="ok"></td>
                                                <td id="minResponseTimeKO" class="ko"></td>
                                            </tr>
                                            <tr>
                                                <td class="title">50th percentile</td>
                                                <td id="percentiles1" class="total"></td>
                                                <td id="percentiles1OK" class="ok"></td>
                                                <td id="percentiles1KO" class="ko"></td>
                                            </tr>
                                            <tr>
                                                <td class="title">75th percentile</td>
                                                <td id="percentiles2" class="total"></td>
                                                <td id="percentiles2OK" class="ok"></td>
                                                <td id="percentiles2KO" class="ko"></td>
                                            </tr>
                                            <tr>
                                                <td class="title">95th percentile</td>
                                                <td id="percentiles3" class="total"></td>
                                                <td id="percentiles3OK" class="ok"></td>
                                                <td id="percentiles3KO" class="ko"></td>
                                            </tr>
                                            <tr>
                                                <td class="title">99th percentile</td>
                                                <td id="percentiles4" class="total"></td>
                                                <td id="percentiles4OK" class="ok"></td>
                                                <td id="percentiles4KO" class="ko"></td>
                                            </tr>
                                            <tr>
                                                <td class="title">Max</td>
                                                <td id="maxResponseTime" class="total"></td>
                                                <td id="maxResponseTimeOK" class="ok"></td>
                                                <td id="maxResponseTimeKO" class="ko"></td>
                                            </tr>
                                            <tr>
                                                <td class="title">Mean</td>
                                                <td id="meanResponseTime" class="total"></td>
                                                <td id="meanResponseTimeOK" class="ok"></td>
                                                <td id="meanResponseTimeKO" class="ko"></td>
                                            </tr>
                                            <tr>
                                                <td class="title">Std Deviation</td>
                                                <td id="standardDeviation" class="total"></td>
                                                <td id="standardDeviationOK" class="ok"></td>
                                                <td id="standardDeviationKO" class="ko"></td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>

            <div class="schema demi">
              <div id="container_indicators" class="demi"></div>
            </div>

            <div class="schema geant">
              <div id="container_distrib" class="geant"></div>
            </div>

            <div class="schema geant">
              <div id="container" class="geant"></div>
            </div>

            <div class="schema geant">
              <a name="requests"></a>
                <div id="container_requests" class="geant"></div>
            </div>

            <div class="schema geant">
              <a name="responses"></a>
                <div id="container_responses" class="geant"></div>
            </div>

            <div class="schema geant">
              <div id="container_response_time_dispersion" class="geant"></div>
            </div>

                        </div>
                    </div>
                </div>
        </div>
    </div>
    <div class="nav">
        <ul></ul>
    </div>
</div>
<div class="foot">
    <a href="http://gatling.io" title="Gatling Home Page"><img alt="Gatling" src="style/logo-gatling.jpg"/></a>
</div>
<script type="text/javascript">
    var pageStats = stats.contents['req_getperson-api-5d02b'].stats;
    $(document).ready(function() {
        $('.sim_desc').popover({trigger:'hover', placement:'bottom'});
        setDetailsLinkUrl();
        setDetailsMenu();
        setActiveMenu();
        fillStats(pageStats);
        
Highcharts.setOptions({
  global: { useUTC: false }
});

var indicatorsChart = new Highcharts.Chart({
  chart: {
    renderTo: 'container_indicators',
    marginRight: 150
  },
  credits: { enabled: false },
  legend: { enabled: false },
  title: { text: 'A title to let highcharts reserve the place for the title set later' },
  xAxis: {
    categories: [
      pageStats.group1.name,
      pageStats.group2.name,
      pageStats.group3.name,
      pageStats.group4.name
    ]
  },
  yAxis: {
    title: { text: 'Number of Requests' }
  },
  tooltip: {
    formatter: function() {
      var s;
      if (this.point.name) { // the pie chart
        s = ''+ this.point.name +': '+ this.y +'% requests';
      } else {
        s = ''+ this.y + ' requests';
      }
      return s;
    }
  },
  plotOptions: {
    series: {
      stacking: 'normal',
      shadow: true
    }
  },
  series: [
    {
      type: 'column',
      color: '#A0B228',
      data: [pageStats.group1.count,0,0,0],
      tooltip: { yDecimals: 0, ySuffix: 'ms' }
    },
    {
      type: 'column',
      color: '#FFDD00',
      data: [0,pageStats.group2.count,0,0],
      tooltip: { yDecimals: 0, ySuffix: 'ms' }
    },
    {
      type: 'column',
      color: '#FF9D00',
      data: [0,0,pageStats.group3.count,0],
      tooltip: { yDecimals: 0, ySuffix: 'ms' }
    },
    {
      type: 'column',
      color: '#FF0000',
      data: [0,0,0,pageStats.group4.count],
      tooltip: { yDecimals: 0, ySuffix: 'ms' }
    },
    {
      type: 'pie',
      name: 'Percentages',
      data: [
        {
          name: pageStats.group1.name,
          y: pageStats.group1.percentage,
          color: '#A0B228'
        },
        {
          name: pageStats.group2.name,
          y: pageStats.group2.percentage,
          color: '#FFDD00'
        },
        {
          name: pageStats.group3.name,
          y: pageStats.group3.percentage,
          color: '#FF9D00'
        },
        {
          name: pageStats.group4.name,
          y: pageStats.group4.percentage,
          color: '#FF0000'
        }
      ],
      center: [470, 85],
      size: 100,
      showInLegend: false,
      dataLabels: { enabled: false }
    }
  ]
});

indicatorsChart.setTitle({
  text: '<span class="chart_title">Indicators</span>',
  useHTML: true
});

	    $('#container_errors').sortable('#container_errors');
    
var responseTimeDistributionChart = new Highcharts.Chart({
  chart: {
    renderTo: 'container_distrib',
    type: 'column'
  },
  credits: {
    enabled: false
  },
  legend: {
    enabled: true,
    floating: true,
    y: -285,
    borderWidth: 0,
    itemStyle: {
      fontWeight: "normal"
    }
  },
  title: {
    text: 'A title to let highcharts reserve the place for the title set later'
  },
  xAxis: {
    categories: ['6', '12', '18', '24', '30', '36', '42', '48', '54', '60', '65', '71', '77', '83', '89', '95', '101', '107', '113', '119', '125', '131', '137', '143', '149', '155', '161', '167', '173', '179', '184', '190', '196', '202', '208', '214', '220', '226', '232', '238', '244', '250', '256', '262', '268', '274', '280', '286', '292', '298', '303', '309', '315', '321', '327', '333', '339', '345', '351', '357', '363', '369', '375', '381', '387', '393', '399', '405', '411', '417', '422', '428', '434', '440', '446', '452', '458', '464', '470', '476', '482', '488', '494', '500', '506', '512', '518', '524', '530', '536', '541', '547', '553', '559', '565', '571', '577', '583', '589', '595'],
    tickInterval: 20
  },
  yAxis: {
    min: 0,
    title: {
      text: 'Percentage of Requests'
    }
  },
  tooltip: {
    formatter: function() {
      return '<b>'+ this.x +' ms</b><br/>'+
      this.series.name +': '+ this.y +' %<br/>'+
      'Total: '+ this.point.stackTotal + ' %';
    }
  },
  plotOptions: {
    series: {
      groupPadding: 0,
      stacking: 'normal',
      shadow: true
    }
  },
  series: [
  	{
type: 'column',
color: '#4572A7',
name: 'OK',
data: [
  10.83,8.56,7.9,7.8,7.53,7.96,6.56,6.1,4.53,3.8,2.76,2.93,2.53,2.46,2.06,1.7,1.6,1.66,1.33,0.8,0.36,0.46,0.43,0.66,0.46,0.43,0.43,0.2,0.16,0.3,0.26,0.26,0.3,0.36,0.13,0.2,0.1,0.16,0.13,0.13,0.1,0.1,0.2,0.13,0.06,0.06,0.1,0.03,0.03,0.1,0.13,0.06,0.06,0.16,0.0,0.03,0.0,0.1,0.03,0.0,0.06,0.0,0.06,0.0,0.1,0.06,0.03,0.03,0.03,0.03,0.0,0.03,0.06,0.0,0.06,0.03,0.03,0.0,0.03,0.03,0.0,0.03,0.0,0.0,0.06,0.0,0.0,0.0,0.0,0.0,0.06,0.0,0.0,0.03,0.0,0.0,0.0,0.0,0.0,0.06
],
tooltip: { yDecimals: 0, ySuffix: 'ms' }
},
  	{
type: 'column',
color: '#FF0000',
name: 'KO',
data: [
  0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0,0.0
],
tooltip: { yDecimals: 0, ySuffix: 'ms' }
}
  ]
});

responseTimeDistributionChart.setTitle({
  text: '<span class="chart_title">Response Time Distribution</span>',
  useHTML: true
});

var responseTimePercentiles = unpack([[1517574853,null],[1517574854,null],[1517574855,null],[1517574856,null],[1517574857,null],[1517574858,null],[1517574859,null],[1517574860,null],[1517574861,null],[1517574862,[193,200,245,286,296,336,377,426,465,475]],[1517574863,[6,14,33,78,103,119,146,180,221,345]],[1517574864,[4,24,46,86,100,118,150,197,282,471]],[1517574865,[4,21,42,79,90,100,129,191,379,542]],[1517574866,[5,32,45,64,70,76,84,111,396,540]],[1517574867,[5,37,50,89,94,104,110,135,265,598]],[1517574868,[4,12,27,63,73,90,119,176,391,595]],[1517574869,[3,13,28,45,52,63,90,112,225,461]],[1517574870,[3,4,5,7,8,9,10,12,21,41]]]);

var responseTimeChart = new Highcharts.StockChart({
  chart: {
    renderTo: 'container',
    zoomType: 'x'
  },
  colors: ['#C4FD90', '#7FF77F', '#6FF2AD', '#60ECE5', '#51A8E7', '#4353E2', '#7335DC', '#BC28D7', '#D11C97', '#C73905', 'Orange'],
  credits: { enabled: false },
  legend: {
    enabled: true,
    floating: true,
    y: -65,
    borderWidth: 0,
    itemStyle: { fontWeight: "normal" }
  },
  title: { text: 'A title to let highcharts reserve the place for the title set later' },
  navigator: { baseSeries: 9 },
  rangeSelector: {
    rangeSelector: { align: "left" },
    buttonSpacing: 0,
    buttonTheme: {
      fill: 'LightGrey',
      padding: 1,
      stroke: 'Black',
      'stroke-width': 0.25,
      style: {
        color: 'Black',
        fontWeight: 'bold',
      },
      states: {
        stroke: 'Black',
        'stroke-width': 0.25,
        hover: {
          fill: 'DarkGrey',
          style: { color: 'black' }
        },
        select: {
          fill: 'DarkOrange',
          style: { color: 'white' }
        }
      }
    },
    buttons : [
      {
        type : 'minute',
        count : 1,
        text : '1m'
      }, {
        type : 'minute',
        count : 10,
        text : '10m'
      }, {
        type : 'hour',
        count : 1,
        text : '1h'
      }, {
        type : 'all',
        count : 1,
        text : 'All'
      }
    ],
    selected : 3,
    inputEnabled : false
  },
  xAxis: {
    type: 'datetime',
    ordinal: false,
    maxZoom: 10000 // three days
  },
  yAxis:[
    {
      min: 0,
      title: {
        text: 'Response Time (ms)',
        style: { color: '#4572A7' }
      },
      opposite: false
    }, {
      min: 0,
      title: {
        text: 'Active Users',
        style: { color: '#FF9D00' }
      },
      opposite: true
    }
  ],
  plotOptions: {
    arearange: { lineWidth: 1 },
    series: {
      dataGrouping: { enabled: false }
    }
  },
  series: [
  
    
         {
pointInterval: 1000,
name: 'min',
data: responseTimePercentiles[0],
tooltip: { yDecimals: 0, ySuffix: 'ms' },
type : 'area',
yAxis: 0,
zIndex: 10
},
         {
pointInterval: 1000,
name: '25%',
data: responseTimePercentiles[1],
tooltip: { yDecimals: 0, ySuffix: 'ms' },
type : 'area',
yAxis: 0,
zIndex: 9
},
         {
pointInterval: 1000,
name: '50%',
data: responseTimePercentiles[2],
tooltip: { yDecimals: 0, ySuffix: 'ms' },
type : 'area',
yAxis: 0,
zIndex: 8
},
         {
pointInterval: 1000,
name: '75%',
data: responseTimePercentiles[3],
tooltip: { yDecimals: 0, ySuffix: 'ms' },
type : 'area',
yAxis: 0,
zIndex: 7
},
         {
pointInterval: 1000,
name: '80%',
data: responseTimePercentiles[4],
tooltip: { yDecimals: 0, ySuffix: 'ms' },
type : 'area',
yAxis: 0,
zIndex: 6
},
         {
pointInterval: 1000,
name: '85%',
data: responseTimePercentiles[5],
tooltip: { yDecimals: 0, ySuffix: 'ms' },
type : 'area',
yAxis: 0,
zIndex: 5
},
         {
pointInterval: 1000,
name: '90%',
data: responseTimePercentiles[6],
tooltip: { yDecimals: 0, ySuffix: 'ms' },
type : 'area',
yAxis: 0,
zIndex: 4
},
         {
pointInterval: 1000,
name: '95%',
data: responseTimePercentiles[7],
tooltip: { yDecimals: 0, ySuffix: 'ms' },
type : 'area',
yAxis: 0,
zIndex: 3
},
         {
pointInterval: 1000,
name: '99%',
data: responseTimePercentiles[8],
tooltip: { yDecimals: 0, ySuffix: 'ms' },
type : 'area',
yAxis: 0,
zIndex: 2
},
         {
pointInterval: 1000,
name: 'max',
data: responseTimePercentiles[9],
tooltip: { yDecimals: 0, ySuffix: 'ms' },
type : 'area',
yAxis: 0,
zIndex: 1
},
  allUsersData
  ]
});

responseTimeChart.setTitle({
  text: '<span class="chart_title chart_title_">Response Time Percentiles over Time (OK)</span>',
  useHTML: true
});

var container_requests = unpack([[1517574853,[0,0, 0]],[1517574854,[0,0, 0]],[1517574855,[0,0, 0]],[1517574856,[0,0, 0]],[1517574857,[0,0, 0]],[1517574858,[0,0, 0]],[1517574859,[0,0, 0]],[1517574860,[0,0, 0]],[1517574861,[0,0, 0]],[1517574862,[11,0, 11]],[1517574863,[157,0, 157]],[1517574864,[369,0, 369]],[1517574865,[455,0, 455]],[1517574866,[487,0, 487]],[1517574867,[432,0, 432]],[1517574868,[543,0, 543]],[1517574869,[464,0, 464]],[1517574870,[82,0, 82]]]);

var requestsChart = new Highcharts.StockChart({
  chart: {
    renderTo: 'container_requests',
    zoomType: 'x'
  },
  credits: { enabled: false },
  legend: {
    enabled: true,
    floating: true,
    itemDistance: 10,
    y: -285,
    borderWidth: 0,
    itemStyle: { fontWeight: "normal" }
  },
  title: { text: 'A title to let highcharts reserve the place for the title set later' },
  rangeSelector: {
    buttonSpacing: 0,
    buttonTheme: {
      fill: 'LightGrey',
      padding: 1,
      stroke: 'Black',
      'stroke-width': 0.25,
      style: {
        color: 'Black',
        fontWeight: 'bold',
      },
      states: {
        stroke: 'Black',
        'stroke-width': 0.25,
        hover: {
          fill: 'DarkGrey',
          style: { color: 'black' }
         },
         select: {
          fill: 'DarkOrange',
          style: { color: 'white' }
        }
      }
    },
    buttons : [
      {
        type : 'minute',
        count : 1,
        text : '1m'
      }, {
        type : 'minute',
        count : 10,
        text : '10m'
      }, {
        type : 'hour',
        count : 1,
        text : '1h'
      }, {
        type : 'all',
        count : 1,
        text : 'All'
      }
    ],
    selected : 3,
    inputEnabled : false
  },
  plotOptions: {
    series: {
      dataGrouping: { enabled: false }
    },
    area: {
      stacking: 'normal'
    }
  },
  xAxis: {
    type: 'datetime',
    ordinal: false,
    maxZoom: 10000 // three days
  },
  yAxis:[
    {
      min: 0,
      title: {
        text: 'Number of requests',
        style: { color: '#4572A7' }
      },
      opposite: false
    }, {
      min: 0,
      title: {
        text: 'Active Users',
        style: { color: '#FF9D00' }
      },
      opposite: true
    }
  ],
  series: [
    {
color: '#4572A7',
name: 'All',
data: container_requests[0],
tooltip: { yDecimals: 0, ySuffix: '', valueDecimals: 0 }
,type: 'area'},
    allUsersData
  ]
});

requestsChart.setTitle({
  text: '<span class="chart_title">Number of requests per second</span>',
  useHTML: true
});

var container_responses = unpack([[1517574853,[0,0, 0]],[1517574854,[0,0, 0]],[1517574855,[0,0, 0]],[1517574856,[0,0, 0]],[1517574857,[0,0, 0]],[1517574858,[0,0, 0]],[1517574859,[0,0, 0]],[1517574860,[0,0, 0]],[1517574861,[0,0, 0]],[1517574862,[5,0, 5]],[1517574863,[151,0, 151]],[1517574864,[352,0, 352]],[1517574865,[455,0, 455]],[1517574866,[486,0, 486]],[1517574867,[433,0, 433]],[1517574868,[546,0, 546]],[1517574869,[486,0, 486]],[1517574870,[86,0, 86]]]);

var requestsChart = new Highcharts.StockChart({
  chart: {
    renderTo: 'container_responses',
    zoomType: 'x'
  },
  credits: { enabled: false },
  legend: {
    enabled: true,
    floating: true,
    itemDistance: 10,
    y: -285,
    borderWidth: 0,
    itemStyle: { fontWeight: "normal" }
  },
  title: { text: 'A title to let highcharts reserve the place for the title set later' },
  rangeSelector: {
    buttonSpacing: 0,
    buttonTheme: {
      fill: 'LightGrey',
      padding: 1,
      stroke: 'Black',
      'stroke-width': 0.25,
      style: {
        color: 'Black',
        fontWeight: 'bold',
      },
      states: {
        stroke: 'Black',
        'stroke-width': 0.25,
        hover: {
          fill: 'DarkGrey',
          style: { color: 'black' }
         },
         select: {
          fill: 'DarkOrange',
          style: { color: 'white' }
        }
      }
    },
    buttons : [
      {
        type : 'minute',
        count : 1,
        text : '1m'
      }, {
        type : 'minute',
        count : 10,
        text : '10m'
      }, {
        type : 'hour',
        count : 1,
        text : '1h'
      }, {
        type : 'all',
        count : 1,
        text : 'All'
      }
    ],
    selected : 3,
    inputEnabled : false
  },
  plotOptions: {
    series: {
      dataGrouping: { enabled: false }
    },
    area: {
      stacking: 'normal'
    }
  },
  xAxis: {
    type: 'datetime',
    ordinal: false,
    maxZoom: 10000 // three days
  },
  yAxis:[
    {
      min: 0,
      title: {
        text: 'Number of responses',
        style: { color: '#4572A7' }
      },
      opposite: false
    }, {
      min: 0,
      title: {
        text: 'Active Users',
        style: { color: '#FF9D00' }
      },
      opposite: true
    }
  ],
  series: [
    {
color: '#4572A7',
name: 'All',
data: container_responses[0],
tooltip: { yDecimals: 0, ySuffix: '', valueDecimals: 0 }
},
{
color: '#FF0000',
name: 'KO',
data: container_responses[1],
tooltip: { yDecimals: 0, ySuffix: '', valueDecimals: 0 }
,type: 'area'},
{
color: '#A0B228',
name: 'OK',
data: container_responses[2],
tooltip: { yDecimals: 0, ySuffix: '', valueDecimals: 0 }
,type: 'area'},
    allUsersData,
{
  
type: 'pie',
name: 'Distribution',
data: [
  {name: 'OK', y: 3000.0, color: '#A0B228'},{name: 'KO', y: 0.0, color: '#FF0000'}
],
center: [775, -40],
size: 70,
showInLegend: false,
dataLabels: { enabled: false },
dataGrouping: { enabled: false }

}

  ]
});

requestsChart.setTitle({
  text: '<span class="chart_title">Number of responses per second</span>',
  useHTML: true
});

var scatterChart = new Highcharts.Chart({
  chart: {
    renderTo: 'container_response_time_dispersion', 
    defaultSeriesType: 'scatter',
    zoomType: 'xy'
  },
  credits: { enabled: false },
  xAxis: {
    title: {
      enabled: true,
      text: 'Global number of requests per second',
      style: { fontWeight: 'bold' }
    },
    startOnTick: true,
    endOnTick: true,
    showLastLabel: true,
    min: 0
  },
  title: { text: 'A title to let highcharts reserve the place for the title set later' },
  yAxis: {
    min: 0,
    title: { text: 'Response Time' }
  },
  tooltip: {
    formatter: function() {
         return ''+ this.y +' ms at ' + this.x + ' allreq/s';
    }
  },
  legend: {
    layout: 'vertical',
    align: 'left',
    verticalAlign: 'top',
    x: 80,
    y: 10,
    floating: true,
    backgroundColor: '#FFFFFF',
    borderWidth: 1,
    borderRadius: 3,
    itemStyle: {
      fontWeight: "normal",
      color: "#274B6D"
    }
  },
  plotOptions: {
    scatter: {
      marker: {
        radius: 3,
        states: {
          hover: {
            enabled: true,
            lineColor: 'rgb(100,100,100)'
          }
        }
      },
      states: {
        hover: {
          marker: { enabled: false }
        }
      }
    }
  },
  series: [
	  {
type: 'scatter',
color: 'rgba(69, 114, 167, .2)',
name: 'OK',
data: [
[82,12],[275,426],[390,180],[399,197],[432,135],[457,191],[464,112],[487,111],[543,176]
]},
	  {
type: 'scatter',
color: 'rgba(255, 0, 0, .2)',
name: 'KO',
data: [
[]
]}
	]
});

scatterChart.setTitle({
  text: '<span class="chart_title">Response Time against Global RPS</span>',
  useHTML: true
});

    });
</script>
</body>
</html>
